<template>
	<footer class="v-footer">
		<div class="index-footer">
			<div class="index-footer-box">
				<div class="footer-nav-box">
					<div class="footer-nav">
						<ul class="footer-nav-parent">
							<li class="footer-nav-list">
								<router-link to="/news">债权服务</router-link>
								<ul class="footer-nav-child footer-nav-childNews">
                  <li class="footer-nav-child-list"><router-link to="">搜索</router-link></li>
									<li class="footer-nav-child-list"><router-link to="">区域筛选</router-link></li>
									<li class="footer-nav-child-list"><router-link to="">类型筛选</router-link></li>
									<li class="footer-nav-child-list"><router-link to="">状态筛选</router-link></li>
                  <li class="footer-nav-child-list"><router-link to="/case">债权列表数据</router-link></li>
								</ul>
							</li>
							<li class="footer-nav-list">
								<router-link to="/laywerService">律师服务</router-link>
								<ul class="footer-nav-child footer-nav-childProd">
									<li class="footer-nav-child-list"><router-link to="/laywerService">介绍列表</router-link></li>
									<li class="footer-nav-child-list"><router-link to="">介绍详情</router-link></li>
									<li class="footer-nav-child-list"><router-link to="">金点子服务</router-link></li>
									<li class="footer-nav-child-list"><router-link to="/ask">法律问答</router-link></li>
								</ul>
							</li>
							<li class="footer-nav-list">
								<router-link to="/notice">公告咨询</router-link>
								<ul class="footer-nav-child">
									<li class="footer-nav-child-list"><router-link to="/notice">介绍列表</router-link></li>
									<li class="footer-nav-child-list"><router-link to="">介绍详情</router-link></li>
								</ul>
							</li>
							<li class="footer-nav-list">
                <router-link to="/aboutus">关于我们</router-link>
								<ul class="footer-nav-child footer_links_ul">
									<li class="footer-nav-child-list"><router-link to="">公司简介</router-link></li>
									<li class="footer-nav-child-list"><router-link to="">联系方式</router-link></li>
                  <li class="footer-nav-child-list"><router-link to="">加入我们</router-link></li>
								</ul>
							</li>
              <li class="footer-nav-list">
                <router-link to="/service/contact">客服热线</router-link>
								<ul class="footer-nav-child footer_links_ul">
									<li class="footer-nav-child-list">400-820-88820</li>
									<li class="footer-nav-child-list">服务时间：8：30-18：00</li>
                  <li class="footer-nav-child-list">
                    <img src="" alt="">
                  </li>
								</ul>
              </li>
						</ul>
					</div>
				</div>
			</div>
      <div class="footer-bottom">
					<p>CopyRight @ 2018 Guozhilaw.com.cn ALL Rights Reservrd</p>
				</div>
		</div>
	</footer>
</template>
<script>
	export default {
		name: 'Footer',
		components: {},
		// mounted (){
		// 	//判断是否为首页，首页则改变友情链接控制字段，只在首页显示
		// 	let that = this
		// 	if(that.$route.params.tag === undefined && that.$route.fullPath === '/'){
		// 		that.$store.commit('setIndexShowLinks', true)
		// 	}else {
		// 		that.$store.commit('setIndexShowLinks', false)
		// 	}
		// }
	}
</script>
<style scoped>
	.index-footer {
	    width:  100%;
	    height:  auto;
	}

	.index-footer-box {
	    width: 1200px;
	    height: auto;
	    margin: 0 auto;
	    padding-bottom: 30px;
	}

	.footer-logo-box {
	    position:  relative;
	    width:  100%;
	    height:  84px;
	    border-bottom: 2px solid #515256;
	}

	.footer-logo {
	    float:  left;
	    margin-top: 28px;
	}

	.footer-phone {
	    float:  right;
	    margin-top:  28px;
	    margin-right: 130px;
	}

	.footer-pic {
	    position:  absolute;
	    top: -77px;
	    right: -15px;
	    overflow:  hidden;
	    width:  129px;
	    height: 161px;
	}

	.footer-nav-box {
	    overflow:  hidden;
	    width:  100%;
	    height:  auto;
	    padding-bottom: 42px;
	}

	.footer-nav {
	    overflow:  hidden;
	    height:  auto;
	    padding-top:  60px;
	}

	.footer-code {
	    position: relative;
	    float:  right;
	    overflow:  hidden;
	    width:  300px;
	    height:  auto;
	    padding-top:  277px;
	}

	ul.footer-nav-parent {
	    overflow:  hidden;
	    width:  100%;
	    height:  auto;
      display: flex;
      justify-content: space-around;
	}

	.footer-nav-parent .footer-nav-list:first-child {
	    margin-left: 0px;
	}

	li.footer-nav-list>a {
	    display:  block;
	    width:  100%;
	    height: 34px;
	    color: #333333;
	    font-size:  14px;
	    font-weight:  bold;
	    line-height:  34px;
	}

	ul.footer-nav-child {
	    overflow:  hidden;
	    width:  100%;
	    height:  auto;
	    padding-top: 12px;
	}

	.footer-nav-child li {
	    width:  100%;
	    height:  30px;
	    font-size:  12px;
	    line-height: 30px;
      color: #999999;
	}

	.footer-nav-child li a {
	    color: #969696;
	}

	.footer-nav-child li a:hover {
	    color: #f9f9fa;
	}

	ul.footer-nav-child.footer_links_ul {
		overflow-y: auto;
		height: 120px;
	}

	ul.footer-nav-child.footer_links_ul li{
		overflow: hidden;
	}

	ul.footer-nav-child.footer_links_ul li a {
		display: block;
		width: 100%;
		padding: 0 5px;
	}

	/*滚动条样式*/
	.footer_links_ul::-webkit-scrollbar {/*滚动条整体样式*/
		width: 4px;     /*高宽分别对应横竖滚动条的尺寸*/
		height: 4px;
	}
	.footer_links_ul::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
		border-radius: 5px;
		box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
		background: rgba(0,0,0,0.2);
	}
	.footer_links_ul::-webkit-scrollbar-track {/*滚动条里面轨道*/
		box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
		border-radius: 0;
		background: rgba(0,0,0,0.1);
	}

	.footer-code>div {
	    float:  right;
	    width:  28px;
	    height: 24px;
	    text-align: center;
	    cursor: pointer;
	    -webkit-transition: all 0.5 ease;
	    -o-transition: all 0.5 ease;
	    transition: all 0.5 ease;
	}

	.footer-weixin-box {
	    margin-right: 24px;
	    margin-left: 23px;
	}

	.code-pic {
	    display: none;
	    position: absolute;
	    top: 70px;
	    right: 0;
	    overflow:  hidden;
	    width: 135px;
	    height: 139px;
	}

	.code-pic img {
	    width:  100%;
	    height: 100%;
	}

	.code-pic.active {
	    display:  block;
	}

	.footer-bottom {
	    overflow:  hidden;
	    width: 100%;
	    height:  28px;
	    color:  #fff;
	    font-size: 12px;
	    text-align:  left;
	    line-height:  28px;
      background: #3B8FEE;
      text-align: center;
	}

</style>
